import React, { useEffect, useState } from 'react'
import { useParams } from 'react-router-dom'
import { searchRoad } from './api';
export default function MetroRoad() {
    type ParamsType = {
        road: string;
    }
    const [list, setList] = useState([])
    const { road } = useParams<ParamsType>()
    const search = async () => {
        const data = await searchRoad(road)
        console.log(data.data.data);
        setList(data.data.data)
    }
    useEffect(() => {

        search()

    }, [])

    return (
        <div>
            <h1>搜索结果</h1>
            <div className='z-z'>

                <div>
                    <p className='b-z'>站点名</p>
                    {list.map((item: any) => {
                        return <p>{item.name}</p>
                    })}
                </div>
                <div>
                    <p className='b-z'>线路</p>
                    {list.map((item: any) => {
                        return <p>{item.lines.length > 2 ? `${(item.lines)[0].lineName}/${(item.lines)[2].lineName}` : (item.lines)[0].lineName}</p>
                    })}
                </div>
            </div>
        </div>
    )
}
